<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			.mydiv{
				width: 199px;
				height: 99px;
				background-color: blueviolet;
				color: white;/* 文字颜色 */
				margin: 0 auto;/* div居中显示 */
				text-align: center;/* 文字对齐 */
			}
			
			.uname{
				width: 123px;
				height: 27px;
				border-radius: 5px;
				/* border: 1px solid red;/* 边框宽1px 实线 红色 */ */
				border: 2px dotted #299E99;
				background-color: azure;				
			}
		</style>
	</head>
	<body>
		<h1>背景样式</h1>
		<div class="mydiv">天气晴朗，万里无云</div>
		<br>
		<input type="text" style="background-color: red;"/>
		
		<h1>边框样式</h1>
		用户名<input type="text" class="uname"/>
	</body>
</html>